/*
 * @Author     : nns4
 * @Date       : 2019-12-17 12:20:49
 * @LastEditors: nns4
 * @FilePath: /citciWechartShop/src/main.less
 * @Description: 辅助类
 */

/**
 * @description: 内容最大宽度 每个页面都要加
 */
* {
  padding: 0;
  margin : 0;
}

.minwidth {
  min-width: 1000px;
}

/**
   * @description: 手型
   */
.cp {
  cursor: pointer !important;
}

/**
   * @description: 浮动
   */

.pull_left {
  float: left;
}

.pull_right {
  float: right;
}

.clearfloat {

  &:before,
  &:after {
    content: " ";
    display: table;
  }

  &:after {
    clear: both;
  }
}

/**
   * @description: 文本超出省略
   */
.text_line1 {
  overflow     : hidden;
  text-overflow: ellipsis;
  white-space  : nowrap
}

.text_line2 {
  text-overflow     : ellipsis;
  display           : -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: v;
  overflow          : hidden;
  word-break        : break-all;
}

.none {
  display: none !important;
}

.block {
  display: block !important;
}

.inlineBlock {
  display: inline-block;
}

/**
   * @description: 间距
   */
@xs: 10px;
@sm: 18px;
@lg: 24px;

.margin {
  margin: @sm
}

.margin_xs {
  margin: @xs
}

.margin_sm {
  margin: @sm
}

.margin_lg {
  margin: @lg
}

.margin_h {
  margin-left : @sm;
  margin-right: @sm
}

.margin_h_xs {
  margin-left : @xs;
  margin-right: @xs
}

.margin_h_sm {
  margin-left : @sm;
  margin-right: @sm
}

.margin_h_lg {
  margin-left : @lg;
  margin-right: @lg
}

.margin_v {
  margin-top   : @sm;
  margin-bottom: @sm
}

.margin_v_xs {
  margin-top   : @xs;
  margin-bottom: @xs
}

.margin_v_sm {
  margin-top   : @sm;
  margin-bottom: @sm
}

.margin_v_lg {
  margin-top   : @lg;
  margin-bottom: @lg
}

.margin_top {
  margin-top: @sm
}

.margin_top_xs {
  margin-top: @xs
}

.margin_top_sm {
  margin-top: @sm
}

.margin_top_lg {
  margin-top: @lg
}

.margin_bottom {
  margin-bottom: @sm
}

.margin_bottom_xs {
  margin-bottom: @xs
}

.margin_bottom_sm {
  margin-bottom: @sm
}

.margin_bottom_lg {
  margin-bottom: @lg
}



.margin_left {
  margin-left: @sm
}

.margin_left_xs {
  margin-left: @xs
}

.margin_left_sm {
  margin-left: @sm
}

.margin_left_lg {
  margin-left: @lg
}



.margin_right {
  margin-right: @sm
}

.margin_right_xs {
  margin-right: @xs
}

.margin_right_sm {
  margin-right: @sm
}

.margin_right_lg {
  margin-right: @lg
}


.padding {
  padding: @sm
}

.padding_xs {
  padding: @xs
}

.padding_sm {
  padding: @sm
}

.padding_lg {
  padding: @lg
}

.padding_xl {
  padding: 3.2rem
}

.padding_h {
  padding-left : @sm;
  padding-right: @sm
}

.padding_h_xs {
  padding-left : @xs;
  padding-right: @xs
}

.padding_h_sm {
  padding-left : @sm;
  padding-right: @sm
}

.padding_h_lg {
  padding-left : @lg;
  padding-right: @lg
}


.padding_v {
  padding-top   : @sm;
  padding-bottom: @sm
}

.padding_v_xs {
  padding-top   : @xs;
  padding-bottom: @xs
}

.padding_v_sm {
  padding-top   : @sm;
  padding-bottom: @sm
}

.padding_v_lg {
  padding-top   : @lg;
  padding-bottom: @lg
}


.padding_top {
  padding-top: @sm
}

.padding_top_xs {
  padding-top: @xs
}

.padding_top_sm {
  padding-top: @sm
}

.padding_top_lg {
  padding-top: @lg
}

.padding_bottom {
  padding-bottom: @sm
}

.padding_bottom_xs {
  padding-bottom: @xs
}

.padding_bottom_sm {
  padding-bottom: @sm
}

.padding_bottom_lg {
  padding-bottom: @lg
}

.padding_left {
  padding-left: @sm
}

.padding_left_xs {
  padding-left: @xs
}

.padding_left_sm {
  padding-left: @sm
}

.padding_left_lg {
  padding-left: @lg
}


.padding_right {
  padding-right: @sm
}

.padding_right_xs {
  padding-right: @xs
}

.padding_right_sm {
  padding-right: @sm
}

.padding_right_lg {
  padding-right: @lg
}


////购物车加入动画
@keyframes carmove {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(0.8);
  }

  50% {
    transform: scale(1.2);
  }

  75% {
    transform: scale(0.8);
  }

  100% {
    transform: scale(1);
  }
}

.carmove {
  animation: carmove .5s ease-in-out;
}